<template>
    <div class="category">
        <h3 class="title">主题： xxx</h3>
        <ul>
            <li v-for="(c, index) in categorys" :key="index">
                {{c}}
            </li>
        </ul>
        <slot></slot>
    </div>
</template>

<script>
export default {
    name: 'Category',
    props: ['categorys'],
}
</script>

<style scoped>
.category {
    width: 150px;
    height: 300px;
    background-color: cornflowerblue;
    border-radius: 20px;
}

.title {
    width: 90%;
    height: 30px;
    margin: auto;
    margin-top: 20px;
    border-radius: 10px;
    background-color: darkgoldenrod;
    line-height: 30px;
    text-align: center;
    color: #fff;
}

img {
    height: 120px;
    margin-left: 20px;
}
</style>